<template>
	<view>
		<view v-if="lists.length > 0">
			<view class="u-p-b-20"></view>
			<view class="item m-bg-main" v-for="(item, index) in lists" :key="item.code">
				<view class="top u-flex u-line-1" @click="toPrepay(item.code)">
					<view class="name">{{ item.name }}</view>
					<view class="phone u-content-color">{{ item.phone }}</view>
					<u-tag type="error" mode="dark" text="默认" v-if="item.type == 1"></u-tag>
					<view v-if="order" class="select u-font-xs u-flex-1 u-text-right u-tips-color">使用这个地址</view>
				</view>
				<u-line class="u-m-t-20"></u-line>
				<view class="content">{{ item.province }} {{ item.city }} {{ item.area }} {{ item.address }}</view>
				<view class="bottom">
					<view class="logistics btn m-inline-block" @click="doRemove(item.code)">删 除</view>
					<view class="evaluate btn m-inline-block" @click="toEdit(item.code)">修 改</view>
				</view>
			</view>
			<view class="u-p-30 u-m-t-30"></view>
			<view class="u-p-30 u-m-t-30"></view>
		</view>

		<view v-else class="item"><u-empty margin-top="200" text="没有收货地址" mode="address"></u-empty></view>

		<view class="m-layout-bottom"><u-button type="error" style="width:60%;" class="m-inline-block" shape="circle" @click="toEdit('')">新建收货地址</u-button></view>

		<m-login ref="login"></m-login>
	</view>
</template>

<script>
export default {
	data() {
		return {
			order: '',
			lists: []
		};
	},
	onLoad(opt) {
		this.order = opt.order || '';
	},
	mounted() {
		this.load();
		setTimeout(() => (this.loading = false), 200);
	},
	methods: {
		// 初始化加载
		load() {
			this.$refs.login.local().then(user => {
				this.$u.get('data/api.auth.address/get').then(ret => {
					this.$u.cache.set('myAddress', ret.data.list);
					this.lists = ret.data.list;
				});
			});
		},
		// 跳转编辑页
		toEdit(code) {
			this.$u.route('pages/address/form', {
				addr: code || '',
				order: this.order || ''
			});
		},
		// 跳转支付页
		toPrepay(code) {
			if (this.order) {
				this.$u.route('pages/order/prepay', {
					addr: code || '',
					order: this.order || ''
				});
			}
		},
		// 删除收货地址
		doRemove(code) {
			let that = this;
			uni.showModal({
				title: '提示',
				content: '确认要删除收货地址吗?',
				success: function(res) {
					if (res.confirm) {
						that.$u.api.post('data/api.auth.address/remove', { code: code }).then(ret => {
							that.load();
						});
					}
				}
			});
		}
	},
	// 下拉刷新处理
	onPullDownRefresh() {
		this.load();
		setTimeout(() => uni.stopPullDownRefresh(), 1000);
	}
};
</script>

<style lang="scss" scoped>
.item {
	margin-bottom: 20rpx;
	padding: 40rpx 30rpx 30rpx 30rpx;

	.top {
		display: flex;
		font-size: 34rpx;
		font-weight: bold;

		.phone {
			margin: 0 40rpx;
		}

		.select {
			font-weight: normal;
		}
	}

	.content {
		color: #999;
		display: flex;
		font-size: 28rpx;
		margin-top: 30rpx;
		justify-content: space-between;
	}

	.bottom {
		margin-top: 30rpx;
		text-align: right;

		.btn {
			width: 120rpx;
			color: $u-type-info-dark;
			border: 2rpx solid $u-border-color;
			font-size: 26rpx;
			text-align: center;
			line-height: 52rpx;
			margin-left: 25rpx;
			border-radius: 26rpx;
		}

		.evaluate {
			color: $u-type-warning-dark;
			border-color: $u-type-warning-dark;
		}
	}
}

.m-layout-bottom {
	width: 100%;
	bottom: 40rpx;
	position: fixed;
	text-align: center;
}
</style>
